<template>
	<view class="x-wrapper-peihuCard">
		<view class="peihuContent">
			<image :src="peihuInfo.img" />
			<view class="peihuDetail">
				<view class="line line1">
					<span>{{ peihuInfo.name }}</span>
					<view class="type" :class="peihuInfo.type== 0? 'type0' : peihuInfo.type == 1 ? 'type1' : 'type2'">
						{{ peihuInfo.typeDesc }}
					</view>
				</view>
				<view class="line line2">
					<view>陪诊数：<span
							style="font-size: 30rpx;font-weight: 600;color: #386FFF;">{{ peihuInfo.peizhengNo }}</span>
					</view>
					<view>从医：<span
							style="font-size: 30rpx;font-weight: 600;color: #386FFF;">{{peihuInfo.workTime }}</span>年
					</view>
				</view>
				<view class="line line3">
					<view><span>{{ peihuInfo.score }}%</span>好频率</view>
					<view><span>{{ peihuInfo.subscribeNo }}</span>人发起预约</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'peihuCard',
		props: {
			peihuInfo: {
				type: Object,
				required: true
			}
		},
		data() {
			return {


			}
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	.x-wrapper-peihuCard {

		.peihuContent {
			background-color: #ffffff;
			border-radius: 18rpx;
			padding-top: 20rpx;
			padding-bottom: 20rpx;
			padding-left: 28rpx;
			padding-right: 21rpx;
			display: flex;
			margin-top: 30rpx;
			height: 120rpx;

			image {
				width: 120rpx;
				height: 120rpx;
			}

			.peihuDetail {
				display: flex;
				flex-direction: column;
				margin-left: 30rpx;
				width: 330rpx;
				justify-content: space-between;

				.line {
					display: flex;
					align-items: center;
				}

				.line1 {
					span {
						font-size: 32rpx;
						font-family: PingFangSC-Semibold, PingFang SC;
						font-weight: 600;
						color: #333333;
						line-height: 43rpx;
						letter-spacing: 2px;
					}

					view {
						min-width: 65rpx;
						height: 30rpx;
						margin-left: 10rpx;
					}

					.type {
						display: flex;
						justify-content: center;
						align-items: center;
						border-radius: 15rpx;
						font-size: 19rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						line-height: 27rpx;
						letter-spacing: 1px;
						padding-left: 13rpx;
						padding-right: 13rpx;
					}

					.type0 {
						background: rgba(42, 218, 182, 0.26);
						color: #2ADAB6;
					}

					.type1 {
						background: rgba(56, 111, 255, 0.26);
						color: #4578ff;
					}

					.type2 {
						background: rgba(255, 211, 188, 0.26);
						color: #FF7630;
					}

				}

				.line2 {
					font-size: 23rpx;
					font-family: PingFangSC-Light, PingFang SC;
					font-weight: 300;
					color: #6F7DA2;
					line-height: 31rpx;
					letter-spacing: 1px;
					display: grid;
					grid-template-columns: 1fr 1fr;
				}

				.line3 {
					display: grid;
					grid-template-columns: 1fr 1fr;
					font-size: 23rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #FF7630;
					line-height: 31rpx;

					span {
						color: #ff8141;
					}
				}

			}

		}

		.subscribeBtn {
			width: 142rpx;
			height: 52rpx;
			background: #386FFF;
			border-radius: 26rpx;
			color: #ffffff;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 23rpx;

			margin-top: 48rpx;
		}

	}
</style>